<template>
    <view class="padding-bottom-lg">
        <view class="" style="height: 250rpx">活动页</view>
        <van-tabs swipeable>
            <van-tab title="待领取">
                <view class="bg-white padding-lg f fv">
                    <view class="radius shadow shadow-lg bg-white f" style="height: 170rpx; margin-bottom: 40rpx">
                        <view class="width_3 f fv light bg-orange fpc">
                            <view class="text-price text-xxl f fac fpc font_w">100</view>
                            <view class="f fpc">代金券</view>
                        </view>
                        <view class="f1 f fv padding-sm bg-white">
                            <view class="f fpj">
                                <view>限时代金券</view>
                            </view>
                            <view class="text-grey text-sm">有效期：2024.05.20—2024.06.20</view>
                            <view class="f">
                                <van-button round type="warning" size="mini">立即领取</van-button>
                            </view>
                        </view>
                    </view>
                </view>
            </van-tab>
            <van-tab title="未使用">
                <view class="bg-white padding-lg f fv">
                    <view class="radius shadow shadow-lg bg-white f" style="height: 170rpx">
                        <view class="width_3 f fv light bg-orange fpc">
                            <view class="text-xxl f fac fpc font_w">8.8折</view>
                            <view class="f fpc">折扣券</view>
                        </view>
                        <view class="f1 f fv padding-sm bg-white">
                            <view class="f fpj">
                                <view>限时折扣券</view>
                                <view class="cu-tag bg-orange sm">已领取</view>
                            </view>
                            <view class="text-grey text-sm">有效期：2024.05.20—2024.06.20</view>
                            <view class="f">
                                <van-button round plain type="warning" size="mini">去使用</van-button>
                            </view>
                        </view>
                    </view>
                </view>
            </van-tab>
            <van-tab title="已使用">
                <view class="bg-white padding-lg f fv">
                    <van-empty description="暂无内容"></van-empty>
                </view>
            </van-tab>
            <van-tab title="已过期">
                <view class="bg-white padding-lg f fv">
                    <van-empty description="暂无内容"></van-empty>
                </view>
            </van-tab>
            <!-- <van-tab title="标签 4">内容 4</van-tab> -->
        </van-tabs>
        <view class="f fv width_1 padding-xl">
            <view class="f fpc text-xl">使用规则</view>
            <view class="f fpc text-grey">
                1.优惠券使用期限:2024年5月1日起至2024年12月30日
                2.优惠券核销:单笔实付满300元可使用一张优惠券。该优惠券不可与其它优惠券叠加使用。3.每张优惠券仅可使用一次，每个品类限使用一张优惠券，不可兑现、找零。
            </view>
        </view>
        <van-button class="po_f width_1" type="primary" block @tap.native="toExchange">积分兑换优惠券</van-button>
    </view>
</template>

<script>
// page/cloud/index.js
export default {
    data() {
        return {
            list: [{}],
            total: 0,
            addressInfo: {}
        };
    }
    /**
     * 生命周期函数--监听页面加载
     */,
    onLoad(options) {},
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady() {},
    /**
     * 生命周期函数--监听页面显示
     */
    onShow(e) {},
    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide() {},
    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload() {},
    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh() {},
    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom() {},
    /**
     * 用户点击右上角分享
     */
    onShareAppMessage() {},
    methods: {
        toAddress() {
            uni.navigateTo({
                url: '../address/index?total='
            });
        },

        showMesErr() {
            this.toastDialog.showDialog({
                content: '没有可选商品',
                icon: 'warning'
            });
        },

        toExchange() {
            uni.navigateTo({
                url: '../../../page/category/index?type=points'
            });
        }
    }
};
</script>
<style>
/* @import './index.css'; */
</style>
